<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #demo {
            width: 400px;
            height: 30px;
            border: 2px solid red;
            border-radius: 20px;
            text-align: center;
            line-height: 30px;

        }

        .d2 span:hover {
            color: blue;
            transform: scale(3);
        }

        .d2 p::before {
            content: 'info:  '
        }

        .d2 p::after {
            content: '   after AAAAAA';
            color: seagreen;
        }

        img {
            width: 70px;
            height: 70px;
            border-radius: 50%;
        }


    </style>
</head>
<body>
<div id="demo">test</div>
<div class="d2">
    <span>this is a book</span>
    <p>my name is jack</p>
</div>

<table>
    <tr>
        <td><img src="../assets/imgs/1.jpg" alt="imgs"/ ></td>
        <td>
            <div>张三</div>
            <div>158****1202</div>
        </td>
    </tr>
</table>

</body>
</html>